/**
 * @author:linjiye
 * @date: 2025/3/24
 * @desc:
 **/

import {StyleSheet, Text, TouchableOpacity, View, Clipboard} from 'react-native'
import React, {useEffect, useState} from 'react'
import PageScrollView from "@/components/PageScrollView";
import PageTabBar from "@/components/PageTabBar";
import NoData from "@/components/NoData";
import FcButton from "@/components/FcButton";
import FcModal from '@/components/FcModal';
import FcTextInput from '@/components/FcTextInput';
import FormTitle from '@/components/FormTitle';
import DatePicker from '@/components/DatePicker';
import useGetStorage from "@/hooks/useGetStorage";
import {router} from "expo-router";
import {Toast, Flex} from "@ant-design/react-native";
import {useDispatch, useSelector} from "react-redux";
import {set_rowData} from "@/store/reducer/contentManage/contentManageSlice";
import Popover from 'react-native-popover-view';

import {
    useGetListQuery,
    useSmsReminderMutation,
    useQwReminderMutation,
    useCopyMutation,
    useGetTagListMutation,
    useDeletContentMutation
} from "@/store/api/contentManage/contentManageApi";

import {
    useGetDeptTreeListQuery,
} from "@/store/api/login/loginApi";

type Props = {}

const index = (props: Props) => {
    const [list,setList] = useState<any>([])
    const [tagList,setTagList] = useState<any>([])
    const [listParams, setListParams] = useState({
        pageNo: 1,
        pageSize: 20,
        startDate: '',
        endDate: '',
        groupId: '',
        createUsername: '',
    })
    const [index, setIndex] = useState<any>(0)
    const [operateOpen, setOperateOpen] = useState(false)
    const [scriptOpen, setScriptOpen] = useState(false)
    const [titleTextOpen, setTitleTextOpen] = useState(false)
    const [deleteOpen, setDeleteOpen] = useState(false)
    const [groupOpen, setGroupOpen] = useState(false)
    const [staffOpen, setStaffOpen] = useState(false)
    const [dateOpen, setDateOpen] = useState(false)
    const [visible, setVisible] = useState(false)
    const [deptTreeList,setDeptTreeList] = useState<any>([])
    const [searchText, setSearchText] = useState<any>('')

    const {data:listDataRef,isSuccess:listSuccess,refetch:listRefetch} = useGetListQuery(listParams)
    const {data:deptListDataRef,isSuccess:deptListSuccess} = useGetDeptTreeListQuery({depType: 2})

    const [smsReminderFun] = useSmsReminderMutation()
    const [qwReminderFun] = useQwReminderMutation()
    const [copyFun] = useCopyMutation()
    const [getTagListFun] = useGetTagListMutation()
    const [deletContentFun] = useDeletContentMutation()

    const dispatch = useDispatch()

    let p = useSelector(state => state.contentManage.rowData)

    useEffect(() => {
        // 在组件加载时调用接口
        getTagList()
    }, []);

    useEffect(() => {
        if(listDataRef?.code === 200){
            const list = listDataRef?.result?.records || []
            const updatedList = list.map((item:any) => ({
                ...item,
                pubTitleIndex: 0,
                titleList: ['', '', '']
            }));
            setList(updatedList)
            console.log(listDataRef,'listDataRef===>');
        }
        if(deptListDataRef?.code === 0){
            let list = deptListDataRef?.result || []
            let arr:any = []

            list.forEach((main:any) => {
                forEachEmpList(main, arr);
            })
            setDeptTreeList(arr)
        }
    },[listSuccess,listDataRef,deptListDataRef, deptListSuccess])

    useEffect(() => {
        listRefetch()
    },[p])

    //获取组件架构
    const forEachEmpList = (obj:any, arr:any) => {
        obj.empList.forEach((user:any) => {
            arr.push({label:user.realname,value:user.realname,key:user.id});
        })
        if(obj.children && obj.children.length > 0) {
            obj.children.forEach((child:any) => {
                forEachEmpList(child, arr);
            })
        }
    }

    // 获取标签列表
    const getTagList = () => {
        getTagListFun({}).then(res => {
            if(res.data.code === 200){
                setTagList(res.data.result.records)
            }
        })
    }

    // 复制文案
    const handleCopyText = async(val:any) => {
        try {
            await Clipboard.setString(val);
            Toast.info('复制成功')
            setOperateOpen(false)
        } catch (error) {
            Toast.info('复制失败')
        }
    }

    // 查看脚本
    const handleScriptOpen = () => {
        if(list[index].videoScript){
            setScriptOpen(true)
        }else{
            handleGenerateScript()
        }
        setOperateOpen(false)
    }

    // 生成脚本
    const handleGenerateScript = async() => {
        Toast.config({ duration: 0})
        let loading:any = null
        setTimeout(() => {
            loading = Toast.loading('脚本生成中')
        }, 100)

        await useGetStorage('token').then(async (token) => {
            try {
                const response = await fetch(`${process.env.EXPO_PUBLIC_API_URL}mm/mmContentManagePub/createVideoScript?id=${list[index].id}`,{
                    method: 'POST',
                    headers: {
                        'content-type': 'application/json',
                        'x-access-token': token,
                    },
                });

                const blob = await response.blob();
                const reader = new FileReader();

                reader.onload = (event:any) => {
                    const result = event.target.result;
                    // 按行分割流式数据
                    const lines = result.split('\n');
                    lines.forEach((line:any) => {
                        if (line) {
                            let newLine = `${line.replace('data:','')}`;
                            // 在这里处理流式数据
                            let res = JSON.parse(newLine)
                            if (res.status == 'success') {
                                let txt = res.text.replace(/(<br\/>)|(<br)/g, '');

                                let arr = JSON.parse(JSON.stringify(list))
                                arr[index].videoScript = txt
                                setList(arr)

                                if(res.stop){
                                    Toast.remove(loading)
                                    Toast.config({ duration: 2})
                                    Toast.info('脚本生成成功')
                                }
                            }
                        }
                    });
                };

                reader.onerror = (error) => {
                    console.error('Error reading blob:', error);
                };

                reader.readAsText(blob);
            }catch (error) {
                Toast.remove(loading)
                Toast.config({ duration: 2})
            }
        })
    }

    //生成发布语
    const handleGenerateTitle = async() => {
        Toast.config({ duration: 0})
        let loading:any = null
        setTimeout(() => {
            loading = Toast.loading('发布语生成中')
        }, 100)

        await useGetStorage('token').then(async (token) => {
            try {
                const response = await fetch(`${process.env.EXPO_PUBLIC_API_URL}mm/mmContentManagePub/createTitle?id=${list[index].id}`,{
                    method: 'POST',
                    headers: {
                        'content-type': 'application/json',
                        'x-access-token': token,
                    },
                });

                const blob = await response.blob();
                const reader = new FileReader();

                reader.onload = (event:any) => {
                    const result = event.target.result;
                    // 按行分割流式数据
                    const lines = result.split('\n');
                    lines.forEach((line:any) => {
                        if (line) {
                            let newLine = `${line.replace('data:','')}`;
                            // 在这里处理流式数据
                            let res = JSON.parse(newLine)
                            if (res.status == 'success') {
                                let txt = res.text.replace(/(<br\/>)|(<br)/g, '');

                                let arr = JSON.parse(JSON.stringify(list))
                                arr[index].title = txt
                                arr[index].titleList = splitTitle(txt)
                                setList(arr)

                                if(res.stop){
                                    Toast.remove(loading)
                                    Toast.config({ duration: 2})
                                    Toast.info('发布语生成成功')
                                }
                            }
                        }
                    });
                };

                reader.onerror = (error) => {
                    console.error('Error reading blob:', error);
                };

                reader.readAsText(blob);
            }catch (error) {
                Toast.remove(loading)
                Toast.config({ duration: 2})
            }
        })
    }

    const splitTitle = (text:any) => {
        if(!text) return [];
        text = text.replace(/[\r\n]+/,'');
        try {
            const arr = JSON.parse('['+text+']');
            return arr;
        }
        catch {
            try {
                return JSON.parse('["'+text+'"]');
            }
            catch {
                return []
            }
        }
    }

    // 短信提醒
    const handlSmsReminder = () => {
        smsReminderFun({id: list[index].id}).then(res => {
            if (res.data.code === 200) {
                Toast.info('提醒成功')
                setOperateOpen(false)
            }
        })
    }

    // 企微提醒
    const handleQwReminder = () => {
        qwReminderFun({id: list[index].id}).then(res => {
            if (res.data.code === 200) {
                Toast.info('提醒成功')
                setOperateOpen(false)
            }
        })
    }

    // 克隆
    const handleCopy = () => {
        copyFun({ids: list[index].id}).then(res => {
            if (res.data.code === 200) {
                Toast.info('克隆成功')
                setOperateOpen(false)
                handleSearch()
            }
        })
    }

    //采纳发布语
    const handleAdopt = (val:any) => {
        let arr = JSON.parse(JSON.stringify(list))
        arr[index].pubTitleIndex = val,
            setList(arr)
    }

    // 删除
    const handlDeleteContent = () => {
        deletContentFun({id: list[index].id}).then(res => {
            if (res.data.code === 200) {
                Toast.info('删除成功')
                setOperateOpen(false)
                handleSearch()
            }
        })
    }

    const handleSearch = () => {
        setListParams({
            ...listParams,
            pageNo: 1,
        })
        setList([])
        listRefetch();
    };

    const handleJump = (item:any) => {
        dispatch(set_rowData(item))
        router.push('/videoPublish?type=contentManage')
    }

    return (
        <View>
            <View>
                {
                    list.map((item:any, index:any) => (
                        <TouchableOpacity activeOpacity={1} style={styles.list_item} key={index} onPress={() => {setIndex(index); router.push('/contentManage/detail'); dispatch(set_rowData(list[index]))}}>
                            <View style={styles.list_item_title_box}>
                                <Text style={styles.list_item_title} numberOfLines={2}>{ item?.content.split(/【标题】[:：]?/)[1]?.split(/【正文】[:：]?/)[0]?.replace(/[\r\n]+/g, '') || item.content}</Text>
                                <Text style={[styles.list_item_status, item.pubStatus == 1 ? {backgroundColor: 'rgba(7, 193, 96, 0.1)', color: '#07C160'} : item.pubStatus == 2 ? {backgroundColor: 'rgba(250, 81, 81, 0.1)', color: '#FA5151'} : null]}>{ !item.pubStatus ? '未发布' : item.pubStatus == 1 ? '已发布' : item.item.pubStatus == 2 ? '发布失败' : '' }</Text>
                            </View>
                            <View style={styles.list_item_Content}>
                                <Text style={styles.list_item_Text} numberOfLines={1}>编写日期：{ item.createTime }</Text>
                                <Text style={styles.list_item_Text} numberOfLines={1}>文案创建人：{ item.createUsername }</Text>
                                { item.templateName ? <Text style={styles.list_item_Text} numberOfLines={1}>文案类型：{ item.templateName}</Text> : null }
                                { item.pubType == 1 ? <Text style={styles.list_item_Text}>发布渠道：快手</Text> : item.pubType == 2 ? <Text style={styles.list_item_Text}>发布渠道：抖音</Text> : null}
                            </View>
                            <View style={styles.list_btn_warp}>
                                <FcButton
                                    onPress={() => {setOperateOpen(true); setIndex(index)}}
                                    type='default'
                                    style={[styles.list_item_btn]}
                                    itemStyle={{width: '100%', height: '100%', borderRadius: 8}}
                                    textName='更多操作'
                                    borderWidth={1}
                                ></FcButton>

                                <FcButton
                                    onPress={() => {setIndex(index); router.push('/contentManage/detail'); dispatch(set_rowData(list[index]))}}
                                    type='default'
                                    style={[styles.list_item_btn]}
                                    itemStyle={{width: '100%', height: '100%', borderRadius: 8}}
                                    textName='查看详情'
                                    borderWidth={1}
                                ></FcButton>

                                <FcButton
                                    onPress={() => !item.videoUrl ? {} : !item.pubStatus ? handleJump(item) : {}}
                                    type='txtJBAndBkJB'
                                    style={[styles.list_item_btn]}
                                    itemStyle={{width: '100%', height: '100%', borderRadius: 8}}
                                    textName={!item.videoUrl ? 'AI成片' : !item.pubStatus ? '发布视频' : '预览'}
                                    borderWidth={1}
                                ></FcButton>
                            </View>
                        </TouchableOpacity>
                    ))
                }
                {!list && <NoData hintText='目前没有数据，AI正在获取，请等待！再次点击关键词刷新获取列表。'/>}
            </View>

            {/* 更多操作弹窗 */}
            <FcModal
                isOpen={operateOpen}
                onFcModalClose={() => setOperateOpen(false)}
                titleText='更多操作'
                titleBottomBorderWidth={0}
            >
                <View>
                    <View style={{height: 4, backgroundColor: '#F1F2F4'}}></View>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => handleCopyText(list[index].content)}>
                        <Text style={{fontSize: 17}}>复制文案</Text>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => handleScriptOpen()}>
                        <Text style={{fontSize: 17}}>{ list[index]?.videoScript ? '查看脚本' : '生成脚本'}</Text>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => {setTitleTextOpen(true); handleGenerateTitle()}}>
                        <Text style={{fontSize: 17}}>生成发布语#话题</Text>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => {router.push('/contentManage/translate'); dispatch(set_rowData(list[index])); setOperateOpen(false)}}>
                        <Text style={{fontSize: 17}}>翻译</Text>
                    </TouchableOpacity>
                    <View style={{height: 12, backgroundColor: '#F1F2F4'}}></View>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => handlSmsReminder()}>
                        <Text style={{fontSize: 17}}>短信提醒 { list[index]?.messageNum ? `(${list[index]?.messageNum})` : '' }</Text>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => handleQwReminder()}>
                        <Text style={{fontSize: 17}}>企微提醒 { list[index]?.wxNum ? `(${list[index]?.wxNum})` : '' }</Text>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => handleCopy()}>
                        <Text style={{fontSize: 17}}>克隆</Text>
                    </TouchableOpacity>
                    <TouchableOpacity style={styles.modal_item_text} onPress={() => setDeleteOpen(true)}>
                        <Text style={{fontSize: 17, color: '#FA5151'}}>删除</Text>
                    </TouchableOpacity>
                </View>
            </FcModal>

            {/* 脚本弹窗 */}
            <FcModal
                isOpen={scriptOpen}
                onFcModalClose={() => setScriptOpen(false)}
                titleText='生成脚本'
                titleBottomBorderWidth={1}
                bottom={
                    <View style={styles.script_bottom}>
                        <FcButton
                            onClick={() => handleGenerateScript()}
                            type='default'
                            style={{width: '48%', height: 40, justifyContent: 'center', backgroundColor: '#F1F2F4', borderRadius: 8, fontSize: 15}}
                            textName='再次生成'
                        />

                        <FcButton
                            onClick={() => handleCopyText(list[index].videoScript)}
                            type='BjJB'
                            colors={['#6989FF', '#C65EFD']}
                            style={{width: '48%', height: 40, justifyContent: 'center'}}
                            itemStyle={{borderRadius: 8, fontSize: 15}}
                            textName='复制脚本'
                        />
                    </View>
                }
            >
                <View>
                    <Text style={{height: '50vh', paddingHorizontal: 16, marginTop: 12, lineHeight: 24}}>{ list[index]?.videoScript }</Text>
                </View>
            </FcModal>

            {/* 发布语弹窗 */}
            <FcModal
                isOpen={titleTextOpen}
                onFcModalClose={() => setTitleTextOpen(false)}
                titleText='AI发布语'
                titleBottomBorderWidth={1}
                titleRight={
                    <Flex style={{height: '100%'}}>
                        <FcButton
                            onClick={() => handleGenerateTitle()}
                            type='BjJB'
                            colors={['#6989FF', '#C65EFD']}
                            style={{width: 72, height: 28}}
                            itemStyle={{borderRadius: 8}}
                            textName='再次生成'
                            borderWidth={1}
                        />
                    </Flex>
                }
            >
                <View style={{padding: 16}}>
                    <View style={{marginBottom: 16}}>
                        <View style={styles.title_text_item}>
                            <FormTitle isLeftIcon title='发布语1' style={{paddingVertical: 0, flex: 1}} />
                            <FcButton
                                onPress={() => handleAdopt(0)}
                                type={list[index]?.pubTitleIndex == 0 ? 'txtJBAndBkJB' : 'default'}
                                style={{width: 60, height: 28}}
                                itemStyle={{width: '100%', height: '100%', borderRadius: 8}}
                                textName={list[index]?.pubTitleIndex == 0 ? '已采纳' : '采纳'}
                                borderWidth={1}
                            ></FcButton>
                        </View>

                        <FcTextInput
                            style={{marginTop: 8}}
                            text={list[index]?.titleList[0]}
                            multiline
                            height={120}
                            placeholder={'输入发布语1'}
                        />
                    </View>

                    <View style={{marginBottom: 16}}>
                        <View style={styles.title_text_item}>
                            <FormTitle isLeftIcon title='发布语2' style={{paddingVertical: 0, flex: 1}} />
                            <FcButton
                                onPress={() => handleAdopt(1)}
                                type={list[index]?.pubTitleIndex == 1 ? 'txtJBAndBkJB' : 'default'}
                                style={{width: 60, height: 28}}
                                itemStyle={{width: '100%', height: '100%', borderRadius: 8}}
                                textName={list[index]?.pubTitleIndex == 1 ? '已采纳' : '采纳'}
                                borderWidth={1}
                            ></FcButton>
                        </View>

                        <FcTextInput
                            style={{marginTop: 8}}
                            text={list[index]?.titleList[1]}
                            multiline
                            height={120}
                            placeholder={'输入发布语2'}
                        />
                    </View>

                    <View>
                        <View style={styles.title_text_item}>
                            <FormTitle isLeftIcon title='发布语3' style={{paddingVertical: 0, flex: 1}} />
                            <FcButton
                                onPress={() => handleAdopt(2)}
                                type={list[index]?.pubTitleIndex == 2 ? 'txtJBAndBkJB' : 'default'}
                                style={{width: 60, height: 28}}
                                itemStyle={{width: '100%', height: '100%', borderRadius: 8}}
                                textName={list[index]?.pubTitleIndex == 2 ? '已采纳' : '采纳'}
                                borderWidth={1}
                            ></FcButton>
                        </View>

                        <FcTextInput
                            style={{marginTop: 8}}
                            text={list[index]?.titleList[2]}
                            multiline
                            height={120}
                            placeholder={'输入发布语3'}
                        />
                    </View>
                </View>
            </FcModal>

            {/* 删除弹窗 */}
            <FcModal
                isOpen={deleteOpen}
                transparent
                closeShow={false}
                animationType='fade'
                onFcModalClose={() => setDeleteOpen(false)}
                style={{width: 280, borderBottomRightRadius: 12, borderBottomLeftRadius: 12}}
                titleText={'确认要删除吗？'}
                titleBottomBorderWidth={0}
                footer={[
                    {
                        text: '取消',
                        onPress: () => setDeleteOpen(false),
                        style: { color: 'rgba(0, 0, 0, 0.5)',fontSize: 17 },
                    },
                    {
                        text: '确认',
                        onPress: () => handlDeleteContent(),
                        style: { color: '#2856FF',fontSize: 17 },
                    },
                ]}
            >
                <Text style={{textAlign:'center',color: 'rgba(0,0,0,0.5)'}}>一旦删除，当前分组将被删除哦~</Text>
            </FcModal>

            {/* 分组弹窗 */}
            <FcModal
                isOpen={groupOpen}
                onFcModalClose={() => setGroupOpen(false)}
                titleText='分组标签'
                titleBottomBorderWidth={1}
            >
                <View style={{flex: 1}}>
                    {tagList.map((item:any, index:any) => (
                        <TouchableOpacity key={index} style={[styles.modal_item_text]} onPress={() => {setListParams({...listParams, pageNo: 1, groupId: item.id}); listRefetch()}}>
                            <Text style={{fontSize: 15, color: listParams.groupId == item.id ? '#2856FF' : ''}}>{item.name}</Text>
                        </TouchableOpacity>
                    ))}
                    {tagList.length == 0 && <Flex justify='center' style={{flex: 1}}><NoData hintText='暂无数据'/></Flex>}
                </View>
            </FcModal>

            {/* 编写人员弹窗 */}
            <FcModal
                isOpen={staffOpen}
                onFcModalClose={() => setStaffOpen(false)}
                titleText='编写人员'
                titleBottomBorderWidth={1}
            >
                <View style={{flex: 1}}>
                    {deptTreeList.map((item:any, index:any) => (
                        <TouchableOpacity key={index} style={[styles.modal_item_text]} onPress={() => {setListParams({...listParams, pageNo: 1, createUsername: item.value}); listRefetch()}}>
                            <Text style={{fontSize: 15, color: listParams.createUsername == item.value ? '#2856FF' : ''}}>{item.value}</Text>
                        </TouchableOpacity>
                    ))}
                    {deptTreeList.length == 0 && <Flex justify='center' style={{flex: 1}}><NoData hintText='暂无数据'/></Flex>}
                </View>
            </FcModal>

            {/* 编写日期弹窗 */}
            <DatePicker
                isOpen={dateOpen}
                titleText={'编写日期'}
                dateRange={[listParams.startDate, listParams.endDate]}
                dateType='range'
                onClose={() => setDateOpen(false)}
                onConfirm={(startDate:any, endDate:any) => {setListParams({...listParams, pageNo: 1, startDate: startDate, endDate: endDate}); listRefetch()}}
            ></DatePicker>
        </View>
    )
}

export default index

const styles = StyleSheet.create({
    filter_item: {
        width: '30%',
        height: 32,
        display: 'flex',
        flexDirection: 'row',
        justifyContent: 'space-between',
        alignItems: 'center',
        borderRadius: 4,
        backgroundColor: '#FFF',
        paddingHorizontal: 8,
        color: 'rgba(0, 0, 0, 0.5)',
        borderWidth: 0.5,
        borderColor: 'rgba(0, 0, 0, 0.1)',
    },
    filter_item_text: {
        fontSize: 12,
        color: 'rgba(0, 0, 0, 0.5)',
        flex: 1
    },
    tabBar_btn: {
        width: 64,
        height: 28,
        display: 'flex',
        justifyContent: "center",
        alignItems: "center",
        fontSize: 12,
        color: '#2856FF',
        borderRadius: 8,
        backgroundColor: 'white'
    },
    list_item: {
        padding: 12,
        borderRadius: 8,
        marginBottom: 8,
        backgroundColor: '#FFF',
    },
    list_item_title_box: {
        display: 'flex',
        flexDirection: "row",
        justifyContent: 'space-between',
    },
    list_item_title: {
        flex: 1,
        fontSize: 15,
        lineHeight: 26,
        marginRight: 12,
        fontWeight: '500',
    },
    list_item_status: {
        height: 22,
        fontSize: 12,
        marginTop: 3,
        lineHeight: 22,
        borderRadius: 4,
        paddingHorizontal: 6,
        color: 'rgba(0, 0, 0, 0.5)',
        backgroundColor: 'rgba(0, 0, 0, 0.06)',
    },
    list_item_Content: {
        display: 'flex',
        flexDirection: "row",
        flexWrap: 'wrap',
        marginVertical: 10,
        justifyContent: 'space-between',
    },
    list_item_Text: {
        width: '46.5%',
        lineHeight: 27,
        color: 'rgba(0, 0, 0, 0.5)',
        fontSize: 13
    },
    list_btn_warp: {
        display: 'flex',
        flexDirection: "row",
        justifyContent: 'space-between',
    },
    list_item_btn: {
        width: '31.5%',
        height: 40,
        lineHeight: 40,
        borderRadius: 8,
        marginHorizontal: 0,
        marginBottom: 0
    },
    modal_item_text: {
        marginHorizontal: 16,
        height: 56,
        alignItems: 'center',
        justifyContent: 'center',
        borderBottomColor: 'rgba(0,0,0,0.05)',
        borderBottomWidth: 1,
        fontSize: 17,
        color: 'rgba(0,0,0,0.9)'
    },
    script_bottom: {
        height: 56,
        display: 'flex',
        flexDirection: "row",
        alignItems: 'center',
        justifyContent: 'space-between',
        paddingHorizontal: 16,
    },
    title_text_item: {
        flexDirection: "row",
        alignItems: 'center',
        justifyContent: 'space-between',
    },
    title_input: {
        backgroundColor: '#F1F2F4',
        color: 'rgba(0,0,0,0.9)',
        fontSize: 17,
        lineHeight: 26,
        borderRadius: 8,
        marginTop: 10,
        paddingVertical: 8,
        paddingHorizontal: 12,
    },
    search_wrap_modal: {
        flexDirection: 'row',
        alignItems: "center",
        backgroundColor: '#F1F2F4',
        borderRadius: 9,
        marginHorizontal: 16,
        height: 40,
        paddingHorizontal: 14
    },
    search: {
        flex: 1,
        height: '100%',
        color: 'rgba(0,0,0,0.9)',
        lineHeight: 20,
    },
    staff_item: {
        height: 48,
        borderRadius: 8,
        marginTop: 10,
        paddingHorizontal: 12,
        backgroundColor: '#FFF',
        display: 'flex',
        flexDirection: 'row',
        justifyContent: 'space-between',
        alignItems: 'center',
    },
    search_wrap: {
        flexDirection: 'row',
        alignItems: "center",
        backgroundColor: '#F1F2F4',
        borderRadius: 9,
        marginHorizontal: 16,
        height: 40,
        paddingHorizontal: 14
    },
})

